<template>
    <div>
        <h1>获取所有的电影院信息</h1>
        <ul> 
            <li v-for="item in list" :key="item.id">{{item.name}}</li>
        </ul>
    </div>
</template>

<script>
//ES6具名导入的语法
import {ajax} from '@/utils/request'
export default {
    data(){
        return{
            list:[]
        }
    },
    methods:{
       async getOperas(){
            //使用async/await
            let response=await ajax('GET','https://www.fastmock.site/mock/4441a79ad5f884f83b784cf4c588bdb6/movies/getAllOperas')
            console.log(response);
            //将JSON字符串变成js对象
            console.log(JSON.parse(response).operas);
            this.list=JSON.parse(response).operas;
        }
    },
     created(){
       //使用then方式获取promies成功后的数据
    //    ajax('GET','https://www.fastmock.site/mock/4441a79ad5f884f83b784cf4c588bdb6/movies/getAllOperas').then(response=>{
    //        //将返回回来的数据由JSON转成js对象
    //        let result=JSON.parse(response)
    //        console.log(result.operas);
    //        //将获取的数据赋值给data的list数据
    //        this.list=result.operas
    //    })
        this.getOperas()
    }
}
</script>

<style>

</style>